<template>
  <el-dialog
    :title="`${isAdd ?'添加' : '修改'} enum item`"
    :visible.sync="dialogVisible"
    width="600px">
    <el-form ref="form" :model="form" :rules="rules" label-width="80px">
      <name-input v-model="form.name"/>
      <enum-type-input :disabled="!isAdd" :type="enumType" v-model="form.type"/>
      <enum-path-input ref="EnumPathInput" :enum-type="form.type" template v-model="form.path"/>
      <uuid-input :enum-type="form.type" v-model="form.uuid"/>
      <index-type-input v-model="form.index"/>
      <description-input v-model="form.description"/>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button size="small" @click="dialogVisible = false">取 消</el-button>
      <el-button size="small" :loading="loading" type="primary" @click="okClick">确 定</el-button>
    </span>
  </el-dialog>
</template>

<script lang="ts">
  import { Component, Vue } from 'vue-property-decorator'
  import { Form } from 'element-ui'
  import WPopView from '@/utils/popView'
  import ArticleModel from '@/models/ArticleModel'
  import EnumModel from '@/models/EnumModel'
  import {
    EnumTypeRule,
    EnumTypeInput,
    IndexTypeRule,
    IndexTypeInput,
    UuidRule,
    UuidInput,
    DescriptionInput,
    NameRule,
    NameInput,
    EnumPathInput,
    EnumPathRule,
    EnumTypeOptions
  } from '@/components/global/input'


  @Component({
    name: 'AddArticle',
    components: {
      EnumTypeInput,
      IndexTypeInput,
      UuidInput,
      DescriptionInput,
      NameInput,
      EnumPathInput,
    }
  })
  export default class ChangePassword extends Vue{

    private dialogVisible = false
    private loading = false
    enumType = EnumTypeOptions.type1
    superModel!: ArticleModel | EnumModel
    isAdd = false

    form = new EnumModel()

    rules = {
      name: NameRule,
      path: EnumPathRule,
      type: EnumTypeRule,
      index: IndexTypeRule,
      uuid: UuidRule,
    }

    /**
     * 显示
     */
    private show(souce: ArticleModel | EnumModel, isAdd = true, projectId: string){
      this.form = new EnumModel()
      // 如果是添加状态 superModel 是父模型，如果是编辑是当前模型
      this.superModel = souce
      this.isAdd = isAdd
      this.dialogVisible = true;
      this.enumType = (souce instanceof EnumModel && souce.tier === 1) ? EnumTypeOptions.type2 : EnumTypeOptions.type1
      if (isAdd) {
        this.form.superId = souce._id
        this.form.project = projectId
      } else {
        Object.assign(this.form, souce)
      }
    }

    private okClick() {
      (this.$refs.form as Form).validate((valid) => {
        if (valid) {
          this.loading = true
          if (this.isAdd) {
            this.form.create(this.superModel instanceof ArticleModel).then(() => {
              WPopView.msgSuccess('添加成功')
              this.dialogVisible = false
              this.$emit('reload')
            }).finally(() => {
              this.loading = false
            })
          } else {
            this.form.update().then(() => {
              WPopView.msgSuccess('修改成功')
              this.dialogVisible = false
              this.$emit('reload')
            }).finally(() => {
              this.loading = false
            })
          }
        } else {
          return false;
        }
      });
    }
  }

</script>

<style scoped>

</style>
